<script setup>
import { onMounted, reactive, ref, watch } from "vue";

import RadioBlock from "../components/RadioBlock.vue";
import { useRoute, useRouter } from "vue-router";
import useUserInfoValue from "../hooks/useUserInfoValue";
import {
    getUserInfoByToken,
    useUpdateInfo,
    useUserInfoByUid,
} from "../api/user";
//初始化
const router = useRouter();
const isBlank = ref(false);
const { sexOption, visibleOpiton } = useUserInfoValue();
const user = ref({
    name: "",
    student_id: "",
    phone: "",
    email: "",
    sex: 1,
    school_id: 1,
    secondary_college: "",
    marjor: "",
    grade: "",
    occupation: "",
    intention: "",
    resume_visible: "",
    info_visible: "",
});
onMounted(() => {
    getDate();
});
//当子可见性大于项目总体可见性时发出警告
watch(
    [() => user.value.info_visible, () => user.value.resume_visible],
    value => {
        ["info_visible"].forEach(value => {
            if (user.value.info_visiblee < user.value[value]) {
                useMessae("不可大于信息可见性", "warning");
                user.value[value] = user.value.vinfo_visible;
            }
        });
    }
);

//获取项目数据
const getDate = async () => {
    const res = await getUserInfoByToken();
    user.value = res.data;
};
//提交数据
const onSubmit = () => {
    useUpdateInfo(user.value).then(res => {
        if (res.code === 200) {
            router.push("/mine");
        }
    });
};
</script>

<template>
    <div v-if="!isBlank" class="container">
        <van-form @submit="onSubmit" label-width="4em">
            <van-cell-group inset>
                <van-field
                    v-model="user.name"
                    :maxlength="10"
                    name="name"
                    label="姓名"
                    placeholder="请输入您的姓名"
                    :rules="[{ required: true, message: '不能为空' }]"
                />
                <van-field
                    v-model="user.student_id"
                    :maxlength="20"
                    name="student_id"
                    label="学号"
                    placeholder="请输入您的学号"
                />
                <van-field
                    v-model="user.phone"
                    :maxlength="11"
                    name="phone"
                    label="电话"
                    placeholder="请输入您的电话"
                />
                <van-field
                    v-model="user.email"
                    :maxlength="30"
                    name="email"
                    label="邮箱"
                    placeholder="请输入您的邮箱"
                />
                <van-field name="status" label="性别">
                    <template #input>
                        <RadioBlock
                            :list="sexOption"
                            v-model:value="user.sex"
                        ></RadioBlock>
                    </template>
                </van-field>
                <!--<van-field name="school" label="学校">

                </van-field>-->
                <van-field
                    v-model="user.secondary_college"
                    :maxlength="30"
                    name="secondary_college"
                    label="学院"
                    placeholder="请输入您的学院"
                />
                <van-field
                    v-model="user.major"
                    :maxlength="30"
                    name="major"
                    label="专业"
                    placeholder="请输入您的专业"
                />
                <van-field
                    v-model="user.grade"
                    :maxlength="30"
                    name="grade"
                    label="年级"
                    placeholder="请输入您的年级"
                />
                <van-field
                    v-model="user.intention"
                    :maxlength="30"
                    name="intention"
                    label="意向"
                    placeholder="请输入您的意向"
                />
                <van-field name="status" label="简历可见">
                    <template #input>
                        <RadioBlock
                            :list="visibleOpiton"
                            v-model:value="user.resume_visible"
                        ></RadioBlock>
                    </template>
                </van-field>
                <van-field name="status" label="信息可见">
                    <template #input>
                        <RadioBlock
                            :list="visibleOpiton"
                            v-model:value="user.info_visible"
                        ></RadioBlock>
                    </template>
                </van-field>
            </van-cell-group>

            <div style="margin: 16px">
                <van-button round block type="primary" native-type="submit">
                    提交
                </van-button>
            </div>
        </van-form>
    </div>
    <van-empty v-else description="无该项目" />
</template>

<style scoped>
.container {
    background-color: var(--main-background-color);
    padding: var(--page-padding) 0px;
    min-height: 100%;
}
</style>
